<template>
  <div>
    <div class="box">
      <div class="q1" @click="qiandao">
        <p><img src="../../assets/img/tw/tw1.png" /></p>
        签到
      </div>
      <div class="q1" @click="lijuan">
        <p><img src="../../assets/img/tw/tw2.png" /></p>
        礼劵
      </div>
      <div @click="onClickRightl" class="q1">
        <p><img src="../../assets/img/tw/tw3.png" /></p>
        砍价
      </div>
      <div @click="onClickRight" class="q1">
        <p><img src="../../assets/img/tw/tw4.png" /></p>
        专栏
      </div>
    </div>
    <div class="q2"></div>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
  methods:{
    onClickRight(){
     this.$router.push({path:"/zhuanlan"})    
    },
      onClickRightl(){
          this.$router.push({path:"/kanjia"})
      },
      qiandao(){
          this.$router.push({path:"/qiandao"})
      },
      lijuan(){
          this.$router.push({path:"/lijuan"})
      }
}
};
</script>
<style scoped>
.box {
  width: 100%;
  height: 100px;
  background: rgb(255,255,255);
  position: relative;
  bottom: 60px;
  left: 0px;
  border-radius: 55px 55px 0px 0px;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.q1 {
  width: 60px;
  height: 75px;
  text-align: center;
  line-height: 40px;
  margin-top: 20px;
}
.q1 p {
  width: 50px;
  height: 50px;
  margin: 0 auto;
}
.q1 p img{
  width: 100%;
}
.q2{
  width: 100%;
  height: 15px;
  margin-top: -40px;
  background: rgb(245,245,245);
}
</style>